<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>人事管理系统——添加用户</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta http-equiv="pragma" content="no-cache"/>
    <meta http-equiv="cache-control" content="no-cache"/>
    <meta http-equiv="expires" content="0"/>
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"/>
    <meta http-equiv="description" content="This is my page"/>
    <link href="../css/css.css" type="text/css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="../js/ligerUI/skins/Aqua/css/ligerui-dialog.css"/>
    <link href="../js/ligerUI/skins/ligerui-icons.css" rel="stylesheet" type="text/css"/>
    <script type="text/javascript" src="../js/jquery-1.11.0.js"></script>
    <script type="text/javascript" src="../js/jquery-migrate-1.2.1.js"></script>
    <script src="../js/ligerUI/js/core/base.js" type="text/javascript"></script>
    <script src="../js/ligerUI/js/plugins/ligerDrag.js" type="text/javascript"></script>
    <script src="../js/ligerUI/js/plugins/ligerDialog.js" type="text/javascript"></script>
    <script src="../js/ligerUI/js/plugins/ligerResizable.js" type="text/javascript"></script>
    <link href="../css/pager.css" type="text/css" rel="stylesheet"/>
    <script src="../js/a/vue.js"></script>
    <script src="../js/a/axios-0.18.0.js"></script>
    <link rel="stylesheet" href="../css/index.css">
    <script src="../js/a/index.js"></script>
    <script src="../js/a/axios-config.js"></script>

</head>
<body class="layout-fixed">
<script language="JavaScript">
    var context = "/hrm", __contextPath = "/hrm", __extendOptions = "main/options";
</script>
<div id="app">
    <table width="100%" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td height="10"></td>
        </tr>
        <tr>
            <td width="15" height="32"><img src="../images/main_locleft.gif" width="15" height="32"></td>
            <td class="main_locbg font2"><img src="../images/pointer.gif">&nbsp;&nbsp;&nbsp;当前位置：用户管理 &gt; 添加用户</td>
            <td width="15" height="32"><img src="../images/main_locright.gif" width="15" height="32"></td>
        </tr>
    </table>
    <table width="100%" height="90%" border="0" cellpadding="5" cellspacing="0" class="main_tabbor">
        <tr valign="top">
            <td>

                <!-- 隐藏表单，flag表示添加标记 -->
                <input type="hidden" name="flag" value="2">
                <table width="100%" border="0" cellpadding="0" cellspacing="10" class="main_tab">
                    <tr>
                        <td class="font3 fftd">
                            <table>
                                <tr>
                                    <td class="font3 fftd">用户名：<input v-model:value="nickname" type="text" name="username" id="username"
                                                                           size="20"/></td>


                                    <td class="font3 fftd">状&nbsp;态：
                                        <select name="status" id="status" @change="chooseCore($event)">
                                            <option  v-for="status in user_status" v-bind:value="status.id">{{status.label}}</option>
                                        </select>
                                    </td>
                                </tr>

                                <tr>
                                    <td class="font3 fftd">登录名：<input v-model:value="username" name="loginname" id="loginname" size="20"/></td>
                                    <td class="font3 fftd">密&nbsp;码：<input v-model:value="password" name="password" id="password" size="20"/></td>

                                </tr>

                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td class="main_tdbor"></td>
                    </tr>

                    <tr>
                        <td align="left" class="fftd">
                            <input type="button" v-on:click="addUser()" value="添加">&nbsp;&nbsp;
                            <input type="reset" value="取消" v-on:click="backUser()">&nbsp;&nbsp;


                        </td>


                    </tr>
                </table>

            </td>
        </tr>
    </table>
    <div style="height:10px;"></div>
</div>


<script>
    vm = new Vue({
            el: '#app',
            data: {
                username: '',
                nickname: '',
                password: '',
                status: '1',
            },
            methods: {
                addUser() {
                    let formData = new FormData()
                    formData.append('username', this.username);
                    formData.append('nickname', this.nickname);
                    formData.append('password', this.password);
                    formData.append('status', this.status);
                    axios.post('/api/user/add', formData)
                        .then(res => {
                            if (res.data.code == 200) {
                                this.openUser(res.data.msg)
                            } else if (res.data.msg) {
                                this.$message.error(res.data.msg);
                            } else {
                                this.$message.error('系统错误');
                            }
                        })
                },
                openUser(msg) {
                    this.$alert(msg, '提示', {
                        confirmButtonText: '确定',
                        callback: function () {
                            window.location.replace('user.html');
                        }
                    })
                },
                backUser() {
                    window.location.replace('user.html')
                },
                userStatus(){
                    this.user_status = JSON.parse(sessionStorage.user_status);
                },
                chooseCore(event){
                    this.status = event.target.value;
                },
            },
            created() {
                this.userStatus();
            },
        })
</script>
</body>
</html>
